<template>
  <view class="flex flex-column align-center">
    <u-navbar title=" " :is-back="false" :background="{ backgroundColor:'#9CE0FF'}" :border-bottom="false" title-color="#000" title-size="37" />
    <image class="mt-265 w-99 h-99" src="@/static/images/common/yk-logo2.png"></image>
    <text class="mt-40 fz-40">净化后勤助手</text>
    <view class="flex mt-100">
      <image class="mr-20 w-40 h-40" src="@/static/images/login/username.png"></image>
      <view class="border-bottom-CCCCCC w-500">
        <u-input v-model="loginForm.username" height="52" placeholder="用户名" placeholder-style="font-size:32rpx;color:#888888"/>
      </view>
    </view>
    <view class="flex mt-50">
      <image class="mr-20 w-40 h-40" src="@/static/images/login/password.png"></image>
      <view class="border-bottom-CCCCCC w-500">
        <u-input v-model="loginForm.password" height="52" type="password" placeholder="密码" placeholder-style="font-size:32rpx;color:#888888"/>
      </view>
    </view>
    <view class="mt-100 w-400 h-80 lh-80 color-fff text-center bg-2D8CF0 fz-30 br-10" @tap="pwdLogin">
      <text>登录</text>
    </view>
    <!--  #ifdef APP-IOS  -->
    <view class="mt-50 w-400 h-80 flex align-center justify-center color-000 bg-fff fz-30 br-10 border-000000" @tap="appleLogin" v-if="isIos">
      <image class="w-48 h-48 mr-10" src="@/static/images/common/apple.png"></image>
      <text>通过Apple登录</text>
    </view>
    <!--  #endif  -->
    <view class="mt-50 w-400 h-80 flex align-center justify-center color-fff  bg-19BE6B fz-30 br-10" @tap="wechatLogin">
      <image class="w-48 h-48 mr-10" src="@/static/images/common/wechat.png"></image>
      <text>微信快速登录</text>
    </view>

  </view>
</template>
<script>
  import { getToken } from '@/utils/auth'
  import { getHospitals } from '@/api/common'
  const systemInfo = uni.getSystemInfoSync()
  export default {
    data() {
      return {
        codeUrl: "",
        loginForm: {
          // username: "user456",
          // username: "jingli",
          // password: "123456",
          //
          username: "",
          password: "",
          uuid: ''
        }
      }
    },
    computed: {
      isIos() {return systemInfo.osName === 'ios'}
    },
    onLoad(){
      //有token则免密登录
      if(getToken()){
        if(this.$auth.hasRoleOr(['head-nurse','nurse'])){
          this.$tab.switchTab('/pages/tabbar/work/work')
        }
        //驻场经理和工程师进入首页
        else {
          this.$tab.switchTab('/pages/tabbar/home/home')
        }
      }
    },
    methods: {
      // 密码登录
      pwdLogin() {
        if (this.loginForm.username === "") {
          this.$modal.msgError("请输入您的账号")
        } else if (this.loginForm.password === "") {
          this.$modal.msgError("请输入您的密码")
        } else {
          this.$modal.loading("登录中，请耐心等待...")
          this.$store.dispatch('pwdLogin', this.loginForm).then(() => {
            this.$modal.closeLoading()
            this.loginSuccess()
          })
        }
      },
      // 微信快速登录
      wechatLogin() {
        this.$modal.loading("登录中，请耐心等待...")
        uni.login({
          provider: 'weixin',
          onlyAuthorize: true,
          success: (loginRes) => {
            this.$store.dispatch('wechatLogin', loginRes.code).then(() => {
              this.$modal.closeLoading()
              this.loginSuccess()
            })
          },
          fail(err) {
            console.log(err)
          }
        });
      },

      // 苹果快速登录
      // #ifdef APP-IOS
      appleLogin() {
        if (!this.isIos) {
          this.$modal.showToast('当前环境不支持苹果登录')
          return Promise.reject('当前环境不支持苹果登录')
        }
        this.$modal.loading("登录中，请耐心等待...")
        return new Promise((resolve, reject) => {
          plus.oauth.getServices(services => {
            const service = services.find(s => s.id === 'apple')
            if (!service) {
              reject('当前环境不支持苹果登录')
            }
            service.logout(() => {
              resolve()
            }, () => {
              resolve()
            })
          }, error => {
            reject(`获取登录鉴权服务列表失败:${JSON.stringify(error)}`)
          })
        }).then(() => {
          return new Promise((resolve, reject) => {
            uni.login({
              provider: 'apple',
              success: (loginRes) => {
                this.$store.dispatch('appleLogin', loginRes.appleInfo.identityToken).then(res => {
                  resolve(res)
                  this.loginSuccess()
                })
              },
              fail:(err) => {
                reject(err)
              }
            })
          })
        }).finally(() => {
          this.$modal.closeLoading()
        })
      },
      // #endif
      // 登录成功后，处理函数
      loginSuccess(result) {
        // 设置用户信息
        this.$store.dispatch('GetInfo').then(res => {
          //护士长直接进入巡检列表
          if(this.$auth.hasRoleOr(['head-nurse','nurse'])){
            this.$tab.switchTab('/pages/tabbar/work/work')
          }
          else if(this.$auth.hasRoleOr(['co-admin','admin'])){
            this.$store.dispatch('ReplaceCurHospitalId', '').finally(()=>this.$tab.switchTab('/pages/tabbar/home/home'))
          }
          else if(this.$auth.hasRoleOr(['engineer','manager'])){
            getHospitals().then(res => {
              const hospitalList = res.data
              if(hospitalList && hospitalList.length>0){
                this.$store.dispatch('ReplaceCurHospitalId', hospitalList[0]?.hospitalId).finally(()=>this.$tab.switchTab('/pages/tabbar/home/home'))
              }
            })
          }else{
            this.$tab.switchTab('/pages/tabbar/home/home')
          }
        })
      }
    },
    options: {styleIsolation: "shared"},
  }
</script>
<style lang="scss">
page {
  background-color: #ffffff;
}
</style>
<style lang="scss" scoped>
  /deep/ .u-input__input{
    font-size: 32rpx !important;
  }
  .input-item {
    width: 80%;
    margin: 20px 50px;
    background-color: #f5f6f7;
    height: 45px;
    border-radius: 20px;

    .icon {
      font-size: 38rpx;
      margin-left: 10px;
      color: #999;
    }

    .input {
      width: 100%;
      font-size: 14px;
      line-height: 20px;
      text-align: left;
      padding-left: 15px;
    }

  }
  .login-code-img {
    height: 45px;
  }


</style>
